// 封装一个统一的全局的http的客户端

import axios from 'axios'
import { Message } from '@arco-design/web-vue'

// 通过instance.get('/api/vblog/v1/blogs/')
// 就可以实现对后端的访问 http://127.0.0.1:8090/api/vblog/v1/blogs/,不用每次都写127.0.0.1:8090
var instance = axios.create({
  // baseURL: 'http://127.0.0.1:8090',
  // baseURL, 沿用vite的代理配置，所以要修改为如下格式
  // http://localhost:5173/login-->http://localhost:5173/api/vblog/v1/tokens/-->http://127.0.0.1:8090/api/vblog/v1/tokens
  baseURL: '', //''为空，表示继承访问前端时的url，也就是http://localhost:5173/api/vblog/v1/tokens/，由于有代理所以会跳转
  // 超时时间5s
  timeout: 5000,
  // 后端Gin 使用的Bind函数, 而非BindJson, 补充请求Data是哪个格式
  headers: { 'Content-Type': 'application/json' }
})

// 请求拦截器
// instance.interceptors.request

// 响应拦截器; 对返回的响应统一处理
instance.interceptors.response.use(
  // 正常响应的数据处理
  (resp) => {
    console.log(resp)
    return resp.data
  },
  // 异常响应的数据处理
  (error) => {
    let msg = error.message
    if (error.response.data && error.response.data.message) {
      // 通用逻辑处理
      msg = error.response.data.message

      // 自定义业务逻辑处理(自定义的code)
      switch (error.response.data.code) {
        case 50001:
          // 页面跳转
          window.location.assign('/login')
          // router.push({name:'Login'}) , 在拦截器中不支持useRouter的用法
          break

        default:
          break
      }
      // 为什么要用Promise.reject,而不是直接返回error.response.data？
      // 因为返回的异常要给Promise对象(登录页面中的LOGIN)用，所以要用此种方式
      return Promise.reject(error.response.data)
    }
    // 注意符号：`登录失败：${msg}`
    Message.error(`登录失败：${msg}`)
  }
)

export default instance
